page{
	min-height: 100%;
	width: 100%;
	background: #F2F2F2;
}
.container {
	
}
.header{
	padding-top: 105upx;
	background: #fff;
}
.order-top{
	overflow: hidden;
	padding: 0upx 24upx;
	
	
	background: #fff;
	display: flex;
	align-items: center;
	justify-content: space-between;
	
}
.top-right-box .top-right-left{
	display: flex;
	align-items: center;
	width:373rpx;
	line-height:56rpx;
	border:1px solid rgba(204,204,204,1);
	border-radius:28px;
	
}
.top-right-left{
	padding: 0 24rpx;
}
.top-right-left .input{
	font-size:28rpx;
	font-family:PingFang SC;
	font-weight:500;
	color:rgba(153,153,153,1);
}

.top-right-left .search{
	margin-right: 20rpx;
}
.top-right-box .top-right-text{
	font-size: 24rpx;
	
}
.order-top .top-left{
	float: left;
}
.order-top .top-left .black{
	width: 19upx;
	height: 33upx;
	margin-right: 20upx;
	position: relative;
	top: 4upx;
}
.top-right-text{
	font-size:28rpx;
	font-family:PingFang SC;
	font-weight:500;
	color:rgba(40,170,253,1);
}

.order-top .top-left text{
	font-size: 28upx;
	color: #333333;
}
.order-top .top-right{
	float: right;
	height: 56upx;
}
.order-top .top-right .search{
	width: 30upx;
	height: 30upx;
	float: left;
	margin-left: 25upx;
	margin-top: 13upx;
}
.order-top .top-right .search-input{
	width: 330upx;
	height: 56upx;
	border: none;
	background: none;
	outline: none;
	font-size: 28upx;
	color: #333;
	margin-left: 15upx;
	float: left;
}
.sty{
	font-size: 28upx;
	color: #8E8E93;
}

.header .card{
	width: 702upx;
	height: 136upx;
	background: #27A9FD;
	border-radius: 20upx;
	margin: 0px auto;
	box-shadow: 0px 0px 15upx #27A9FD;
	margin-top: 30upx;
	display: flex;
	justify-content: space-between;
	padding-top: 30upx;
	box-sizing: border-box;
}
.header .card .card-list{
	flex: 1;
	text-align: center;
	color: #fff;
}
.header .card .card-list .num{
	font-size: 36upx;
	font-weight: bold;
}
.header .card .card-list .dec{
	font-size: 24upx;
	margin-top: 10upx;
	
}

.header .table{
	margin-top: 22upx;
	padding: 0px 25upx;
}
.header .table .scroll{
	width: 100%;
}
.header .table  .table-box{
	width: 100%;
	display: flex;
	flex-wrap: nowrap;
}
	
.header .table .scroll .table-list{
	height: 72upx;
	text-align: center;
	font-size: 28upx;
	line-height: 72upx; 
	position: relative;
	flex:0 0 auto;
	margin-right: 30upx;
	
}
.header .table .scroll  .active{
	color: #27A9FD;
	font-size: 32upx;
	font-weight: bold;
}
.header .table .scroll  .active::after{
	content: '';
	display: block;
	width: 40upx;
	height: 6upx;
	border-radius: 3upx;
	background: #27A9FD;
	position: absolute;
	bottom: 0upx;
	left: 50%;
	margin-left: -20upx;
}

.top-right-left .search{
	width: 30rpx;
	height: 30rpx;
	display: block;
}
.top-right-box {
	display: flex;
	align-items: center;
}
.top-right-left{
	margin-right: 20rpx;
}










